<style>
<!--
table.hovertable {
    font-family: verdana,arial,sans-serif;
    font-size:11px;
    color:#333333;
    border-width: 1px;
    border-color: #999999;
    border-collapse: collapse;
    width: 100%;
}
table.hovertable th {
    background-color:#c3dde0;
    border-width: 1px;
    padding: 5px;
    border-style: solid;
    border-color: white;
}
table.hovertable tr {
    background-color:#d4e3e5;
}
table.hovertable td {
    border-width: 1px;
    padding: 5px;
    border-style: solid;
    border-color: white;
}
-->
</style>
<div  style="position: absolute;bottom: -16px;border: 8px solid transparent;border-top-color: #fff;left: 50%;margin-left: -8px;"></div><div style="padding:0px;">
#if(propertyRender && propertyRender.properties && propertyRender.properties.size()>0)
<div class="layui-card">
  <div class="layui-card-body" style="padding: 0px;">
	<table class="hovertable">
		#for(property : propertyRender.properties)
			<tr>
				<td style="height: 20px;">#(property.key)</td>
				<td>#(property.value)</td>
			</tr>
		#end	
	</table>  
  </div>
</div>
#end
</div>

